<template>
	<view>

		<!-- HTML代码开始 -->
		<!-- 左侧:主体 右侧:二维码 -->
		<div style="display: flex;width: 760px;">
			<!-- 标题+表格 -->
			<div style="display: flex;flex-direction: column;width: 660px;">
				<div style="display: flex;align-items: center;">
					<div style="margin: 0 60px 0 60px;visibility: hidden;">自提</div>
					<div style="font-size: 21px;font-family: '宋体';font-weight: bold;">山东致胜供应链管理有限公司托运单</div>
				</div>
				<div style="display: flex;justify-content: space-between;font-size: 15px;margin: 2px 10px 0 10px;">
					<div>起运站：${this.consignor_info.city}</div>
					<div>到站：${this.consignee_info.city}</div>
					<div>中转站：</div>
					<div>运单号：${this.reservation_num}</div>
				</div>
				<table style="border: 1px solid black;border-collapse: collapse;text-align: center;width: 660px;">
					<tr>
						<td style="border: 1px solid black;min-width: 80px;">发货</td>
						<td style="border: 1px solid black;max-width: 100px;min-width: 80px;">${this.consignor_info.name}</td>
						<td style="border: 1px solid black;max-width: 80px;min-width: 60px;">电话</td>
						<td style="border: 1px solid black;min-width: 100px;">${this.consignor_info.phone}</td>
						<td style="border: 1px solid black;min-width: 80px;">身份ID</td>
						<td colspan="2" style="border: 1px solid black;max-width: 100px;"></td>
					</tr>
					<tr>
						<td style="border: 1px solid black;min-width: 80px;">收货</td>
						<td style="border: 1px solid black;max-width: 100px;min-width: 80px;">${this.consignee_info.name}</td>
						<td style="border: 1px solid black;max-width: 80px;min-width: 60px;">电话</td>
						<td style="border: 1px solid black;min-width: 100px;">${this.consignee_info.phone}</td>
						<td style="border: 1px solid black;min-width: 80px;">卡号</td>
						<td colspan="2" style="border: 1px solid black;max-width: 100px;"></td>
					</tr>

					<tr>
						<td style="border: 1px solid black;max-width: 100px;;">货名</td>
						<td style="border: 1px solid black;max-width: 100px;min-width: 80px;">件数</td>
						<td style="border: 1px solid black;max-width: 80px;min-width: 60px;">保费</td>
						<td style="border: 1px solid black;width: 100px;font-size: 15px;">付款方式</td>
						<td style="border: 1px solid black;max-width: 50px;">运费</td>
						<td style="border: 1px solid black;min-width: 50px;">代收</td>
						<td style="border: 1px solid black;min-width: 50px;">提付</td>
					</tr>
					<tr>
						<td style="border: 1px solid black;max-width: 100px;">${this.goods_info[0].name}</td>
						<td style="border: 1px solid black;max-width: 100px;min-width: 80px;">${this.goods_info[0].numbers}</td>
						<td style="border: 1px solid black;max-width: 80px;min-width: 60px;"></td>
						<td style="border: 1px solid black;width: 100px;"></td>
						<td style="border: 1px solid black;max-width: 50px;"></td>
						<td style="border: 1px solid black;min-width: 50px;"></td>
						<td style="border: 1px solid black;min-width: 50px;"></td>
					</tr>

					<tr>
						<td colspan="7" style=";border: 1px solid black;">
							<div style="display: flex;">
								<div>到站地址：${this.consignee_info.detail}</div>
								<div style="margin: 0 0 0 20px;">电话：${this.consignee_info.phone}</div>
							</div>
						</td>
					</tr>

					<tr>
						<td colspan="7" style="border: 1px solid black;max-width: 140px;text-align: left;">备注：${this.remark}</td>
					</tr>

					<tr>
						<td colspan="7" style="font-size: 10px;">
							托运需知：
							1、开单时，不得虚报货名、危险品不予托运、否则出现一切损失由托运人负责；
							2、有保价时、发生货差、货损时按货物实际损失的价格赔偿、最高为该批货物的声明保价；如未保价发生货损货差时最多不超过运费的3倍，代收货款不作为赔偿依据，签收时请清点检查物品是否完好、已经签收概不负责；
							3、此单据收取运费均未含税；如需发票请联系财务预约开票；
							4、对于易碎品、陶瓷、玻璃（瓶）、生鲜、冻品、液体以及不可拆解的大型运输货物造成货差、货损不予理赔、保运不保损。
							5、托运人提供的收获地址或联系方式不准确，造成货物无法交付、延迟交付或交付错误的，承运人不承担责任，承运人并有权就额外运输服务加计运费。
							6、发生纠纷由临沂仲裁委裁决。
							7、此单据签收3日后不再做追责依据！如您在本公司托运货物，意味着你已知晓并认可托运须知。
						</td>
					</tr>
				</table>
				<div style="display: flex;justify-content: space-between;font-size: 13px;margin: 0 10px 0 10px;">
					<div>查货电话:05398535656</div>
					<div>查款电话:18315721572</div>
					<div>打印时间:${timestampToYMDHM(Date.now())}</div>
					<div>制单人:${this.user_info.user_name}</div>
				</div>
			</div>
			<!-- 二维码查货 -->
			<div style="display: flex;flex-direction: column;width: 100px;align-items: center;justify-content: center;">
				<image style="width: 66px;height: 66px;" src="/static/a_qrcode_01.jpg"></image>
				<div style="margin: 16px 0 0 0;font-size: 14px;">微信扫码查货</div>
			</div>
		</div>
		<!-- HTML代码结束 -->

	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style>

</style>